<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>品优购商城</title>
  <!-- 网站说明 -->
  <meta name="description" content="品优购商城">
  <meta name="keywords" content="网上购物,网上商城">
  <!--  -->
  <link rel="stylesheet" href="./css/base.css">
  <link rel="stylesheet" href="./css/common.css">
  <link rel="stylesheet" href="./css/index.css">
  <link rel="shortcut icon" href="/favicon.ico">

</head>

<body>
  <div class="shortcut">
    <div class="w clearfix">
      <div class="cut1 fl">
        <ul>
          <li class="fl">品优购欢迎您!</li>
          <li class="fl">
            <a href="#">请登录</a>
            <a href="register.html" class="style_red">免费注册</a>
          </li>
        </ul>
      </div>
      <div class="cut2 fr">
        <ul>
          <li>我的订单</li>
          <li></li>
          <li class="arrow-icon">我的品优购</li>
          <li></li>
          <li>企业采购</li>
          <li></li>
          <li>关注品优购</li>
          <li></li>
          <li>客户服务</li>
          <li></li>
          <li class="arrow-icon">网站导航</li>
          <li></li>
          <li class="arrow-icon">品优购会员</li>
        </ul>
      </div>
    </div>
  </div>



  <header class="w">
    <div class="logo">
      <h1>
        <a href="index.html" title="品优购">品优购</a>
      </h1>
    </div>
    <div class="search clearfix">
      <input type="search" name="" id="" placeholder="输入内容">
      <button>搜索</button>
    </div>
    <div class="hotwords">
      <a href="#">9.9团购</a>
      <a href="#">亿元优惠</a>
      <a href="#">办公用品</a>
      <a href="#">亿元优惠</a>
      <a href="#">办公用品</a>
      <a href="#">电脑</a>
      <a href="#">通信</a>
    </div>
    <div class="shopcar">我的购物车
      <i class="count">888</i>
    </div>
  </header>



  <nav>
    <div class="w clearfix">
      <div class="dropdown fl">
        <div class="dt">商品全部分类</div>
        <div class="dd">
          <ul>
            <li><a href="#">家用电器</a></li>
            <li><a href="list.html">手机、数码、通信</a></li>
            <li><a href="#">手机、数码、通信</a></li>
            <li><a href="#">手机、数码、通信</a></li>
            <li><a href="#">手机、数码、通信</a></li>
            <li><a href="#">手机、数码、通信</a></li>
            <li><a href="#">手机、数码、通信</a></li>
            <li><a href="#">手机、数码、通信</a></li>
            <li><a href="#">手机、数码、通信</a></li>
            <li><a href="#">手机、数码、通信</a></li>
            <li><a href="#">手机、数码、通信</a></li>
            <li><a href="#">手机、数码、通信</a></li>
            <li><a href="#">手机、数码、通信</a></li>
            <li><a href="#">手机、数码、通信</a></li>
            <li><a href="#">手机、数码、通信</a></li>
          </ul>
        </div>
      </div>
      <div class="navitems fl">
        <ul class="clearfix">
          <li><a href="#">服装城</a></li>
          <li><a href="#">美服装城</a></li>
          <li><a href="#">美丽服装城</a></li>
          <li><a href="#">服装城</a></li>
          <li><a href="#">服装城</a></li>
          <li><a href="#">服装城</a></li>
          <li><a href="#">服装城</a></li>
          <li><a href="#">服装城</a></li>
        </ul>
      </div>
    </div>
  </nav>


  <!-- 主体 -->
  <div class="w">
    <div class="main clearfix">
      <div class="focus fl">
        <img src="./images/banner_bg.png" alt="">

      </div>
      <div class="newsflash fr">
        <div class="news">
          <div class="news-hd clearfix">
            <h5>品优购快报</h5>
            <a href="#">更多</a>
          </div>
          <div class="news-bd">
            <ul>
              <li><a href="#"><strong>[重磅]</strong>好好学习，天天向上,xxxxxxxxxxxxxxx</a></li>
              <li><a href="#"><strong>[重磅]</strong>好好学习，天天向上</a></li>
              <li><a href="#"><strong>[重磅]</strong>好好学习，天天向上</a></li>
              <li><a href="#"><strong>[重磅]</strong>好好学习，天天向上</a></li>
              <li><a href="#"><strong>[重磅]</strong>好好学习，天天向上</a></li>
            </ul>
          </div>
        </div>
        <div class="lifeservice">
          <ul>
            <li>
              <i></i>
              <p>花费</p>
            </li>
            <li>
              <i></i>
              <p>花费</p>
            </li>
            <li>
              <i></i>
              <p>花费</p>
            </li>
            <li>
              <i></i>
              <p>花费</p>
            </li>
            <li>
              <i></i>
              <p>花费</p>
            </li>
            <li>
              <i></i>
              <p>花费</p>
            </li>
            <li>
              <i></i>
              <p>花费</p>
            </li>
            <li>
              <i></i>
              <p>花费</p>
            </li>
            <li>
              <i></i>
              <p>花费</p>
            </li>
            <li>
              <i></i>
              <p>花费</p>
            </li>
            <li>
              <i></i>
              <p>花费</p>
            </li>
            <li>
              <i></i>
              <p>花费</p>
            </li>
          </ul>
        </div>
        <div class="bargain">
          <img src="./images/ad.jpg" alt="">
        </div>
      </div>
    </div>
  </div>


  <!-- 推荐 -->
  <div class="w recom clearfix">
    <div class="recom-a fl">
      <img src="./images/clock.png" alt="">
      <p>今日推荐</p>
    </div>
    <div class="recom-b fl">
      <ul class="clearfix">
        <li><img src="./images/recommend01.png" alt=""></li>
        <li><img src="./images/recommend01.png" alt=""></li>
        <li><img src="./images/recommend01.png" alt=""></li>
        <li><img src="./images/recommend01.png" alt=""></li>
      </ul>
    </div>
  </div>


  <!-- 楼层 -->
  <div class="floor">
    <div class="w first one">
      <div class="first-a">
        <h3>家用电器</h3>
        <div class="list fr">
          <ul>
            <li><a href="#" class="style_red">热门</a>|</li>
            <li><a href="#">大热门</a>|</li>
            <li><a href="#">大大热门</a>|</li>
            <li><a href="#">大大大热门</a></li>
          </ul>
        </div>
      </div>
      <div class="first-b active">
        <div class="content">
          <div class="item1">
            <div class="col-210">
              <ul>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
              </ul>
              <a href="#">
                <img src="./images/floor-1-1.png" alt="">
              </a>
            </div>
            <div class="col-329">
              <a href="#"><img src="./images/floor-1-b01.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-2.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-3.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-4.png" alt=""></a>
            </div>
            <div class="col-219">
              <a href="#"><img src="./images/floor-1-5.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-6.png" alt=""></a>
            </div>
          </div>
        </div>
      </div>
      <div class="first-b ">
        <div class="content">
          <div class="item1">
            <div class="col-210">
              <ul>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
              </ul>
              <a href="#">
                <img src="./images/floor-1-1.png" alt="">
              </a>
            </div>
            <div class="col-329">
              <a href="#"><img src="./images/floor-1-b01.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-2.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-2.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-4.png" alt=""></a>
            </div>
            <div class="col-219">
              <a href="#"><img src="./images/floor-1-2.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-2.png" alt=""></a>
            </div>
          </div>
        </div>
      </div>
      <div class="first-b ">
        <div class="content">
          <div class="item1">
            <div class="col-210">
              <ul>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
              </ul>
              <a href="#">
                <img src="./images/floor-1-1.png" alt="">
              </a>
            </div>
            <div class="col-329">
              <a href="#"><img src="./images/floor-1-b01.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-3.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-3.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-4.png" alt=""></a>
            </div>
            <div class="col-219">
              <a href="#"><img src="./images/floor-1-3.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-3.png" alt=""></a>
            </div>
          </div>
        </div>
      </div>
      <div class="first-b ">
        <div class="content">
          <div class="item1">
            <div class="col-210">
              <ul>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
              </ul>
              <a href="#">
                <img src="./images/floor-1-1.png" alt="">
              </a>
            </div>
            <div class="col-329">
              <a href="#"><img src="./images/floor-1-b01.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-5.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-5.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-4.png" alt=""></a>
            </div>
            <div class="col-219">
              <a href="#"><img src="./images/floor-1-5.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-5.png" alt=""></a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="floor">
    <div class="w first two">
      <div class="first-a">
        <h3>人气推荐</h3>
        <div class="list fr">
          <ul>
            <li><a href="#" class="style_red">热门</a>|</li>
            <li><a href="#">大热门</a>|</li>
            <li><a href="#">大大热门</a>|</li>
            <li><a href="#">大大大热门</a></li>
          </ul>
        </div>
      </div>
      <div class="first-b active">
        <div class="content">
          <div class="item1">
            <div class="col-210">
              <ul>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
              </ul>
              <a href="#">
                <img src="./images/floor-1-1.png" alt="">
              </a>
            </div>
            <div class="col-329">
              <a href="#"><img src="./images/floor-1-b01.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-2.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-3.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-4.png" alt=""></a>
            </div>
            <div class="col-219">
              <a href="#"><img src="./images/floor-1-5.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-6.png" alt=""></a>
            </div>
          </div>
        </div>
      </div>
      <div class="first-b ">
        <div class="content">
          <div class="item1">
            <div class="col-210">
              <ul>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
              </ul>
              <a href="#">
                <img src="./images/floor-1-1.png" alt="">
              </a>
            </div>
            <div class="col-329">
              <a href="#"><img src="./images/floor-1-b01.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-2.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-2.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-4.png" alt=""></a>
            </div>
            <div class="col-219">
              <a href="#"><img src="./images/floor-1-2.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-2.png" alt=""></a>
            </div>
          </div>
        </div>
      </div>
      <div class="first-b ">
        <div class="content">
          <div class="item1">
            <div class="col-210">
              <ul>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
              </ul>
              <a href="#">
                <img src="./images/floor-1-1.png" alt="">
              </a>
            </div>
            <div class="col-329">
              <a href="#"><img src="./images/floor-1-b01.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-3.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-3.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-4.png" alt=""></a>
            </div>
            <div class="col-219">
              <a href="#"><img src="./images/floor-1-3.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-3.png" alt=""></a>
            </div>
          </div>
        </div>
      </div>
      <div class="first-b ">
        <div class="content">
          <div class="item1">
            <div class="col-210">
              <ul>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
              </ul>
              <a href="#">
                <img src="./images/floor-1-1.png" alt="">
              </a>
            </div>
            <div class="col-329">
              <a href="#"><img src="./images/floor-1-b01.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-5.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-5.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-4.png" alt=""></a>
            </div>
            <div class="col-219">
              <a href="#"><img src="./images/floor-1-5.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-5.png" alt=""></a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>


  <div class="floor">
    <div class="w first three">
      <div class="first-a">
        <h3>热门品牌</h3>
        <div class="list fr">
          <ul>
            <li><a href="#" class="style_red">热门</a>|</li>
            <li><a href="#">大热门</a>|</li>
            <li><a href="#">大大热门</a>|</li>
            <li><a href="#">大大大热门</a></li>
          </ul>
        </div>
      </div>
      <div class="first-b  active">
        <div class="content">
          <div class="item1">
            <div class="col-210">
              <ul>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
              </ul>
              <a href="#">
                <img src="./images/floor-1-1.png" alt="">
              </a>
            </div>
            <div class="col-329">
              <a href="#"><img src="./images/floor-1-b01.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-2.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-3.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-4.png" alt=""></a>
            </div>
            <div class="col-219">
              <a href="#"><img src="./images/floor-1-5.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-6.png" alt=""></a>
            </div>
          </div>
        </div>
      </div>
      <div class="first-b ">
        <div class="content">
          <div class="item1">
            <div class="col-210">
              <ul>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
              </ul>
              <a href="#">
                <img src="./images/floor-1-1.png" alt="">
              </a>
            </div>
            <div class="col-329">
              <a href="#"><img src="./images/floor-1-b01.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-2.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-2.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-4.png" alt=""></a>
            </div>
            <div class="col-219">
              <a href="#"><img src="./images/floor-1-2.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-2.png" alt=""></a>
            </div>
          </div>
        </div>
      </div>
      <div class="first-b ">
        <div class="content">
          <div class="item1">
            <div class="col-210">
              <ul>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
              </ul>
              <a href="#">
                <img src="./images/floor-1-1.png" alt="">
              </a>
            </div>
            <div class="col-329">
              <a href="#"><img src="./images/floor-1-b01.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-3.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-3.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-4.png" alt=""></a>
            </div>
            <div class="col-219">
              <a href="#"><img src="./images/floor-1-3.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-3.png" alt=""></a>
            </div>
          </div>
        </div>
      </div>
      <div class="first-b ">
        <div class="content">
          <div class="item1">
            <div class="col-210">
              <ul>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
                <li><a href="#">节能补贴</a></li>
              </ul>
              <a href="#">
                <img src="./images/floor-1-1.png" alt="">
              </a>
            </div>
            <div class="col-329">
              <a href="#"><img src="./images/floor-1-b01.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-5.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-5.png" alt=""></a>
            </div>
            <div class="col-221">
              <a href="#"><img src="./images/floor-1-4.png" alt=""></a>
            </div>
            <div class="col-219">
              <a href="#"><img src="./images/floor-1-5.png" alt=""></a>
              <a href="#"><img src="./images/floor-1-5.png" alt=""></a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>



  <footer>
    <div class="w">
      <div class="mod_service">
        <ul class="clearfix">
          <li class="clearfix">
            <h5></h5>
            <div>
              <h4>正品保证</h4>
              <p>正品保证，提供发票</p>
            </div>
          </li>
          <li class="clearfix">
            <h5></h5>
            <div>
              <h4>正品保证</h4>
              <p>正品保证，提供发票</p>
            </div>
          </li>
          <li class="clearfix">
            <h5></h5>
            <div>
              <h4>正品保证</h4>
              <p>正品保证，提供发票</p>
            </div>
          </li>
          <li class="clearfix">
            <h5></h5>
            <div>
              <h4>正品保证</h4>
              <p>正品保证，提供发票</p>
            </div>
          </li>
        </ul>
      </div>
      <div class="mod_help clearfix">
        <dl>
          <dt>服务指南</dt>
          <dd><a href="#">购物流程</a></dd>
          <dd><a href="#">大酒店</a></dd>
          <dd><a href="#">购物流程/团购</a></dd>
          <dd><a href="#">购物流程</a></dd>
          <dd><a href="#">购物流程</a></dd>
          <dd><a href="#">购物流程</a></dd>
        </dl>
        <dl>
          <dt>服务指南</dt>
          <dd><a href="#">购物流程</a></dd>
          <dd><a href="#">大酒店</a></dd>
          <dd><a href="#">购物流程/团购</a></dd>
          <dd><a href="#">购物流程</a></dd>
          <dd><a href="#">购物流程</a></dd>
          <dd><a href="#">购物流程</a></dd>
        </dl>
        <dl>
          <dt>服务指南</dt>
          <dd><a href="#">购物流程</a></dd>
          <dd><a href="#">大酒店</a></dd>
          <dd><a href="#">购物流程/团购</a></dd>
          <dd><a href="#">购物流程</a></dd>
          <dd><a href="#">购物流程</a></dd>
          <dd><a href="#">购物流程</a></dd>
        </dl>
        <dl>
          <dt>服务指南</dt>
          <dd><a href="#">购物流程</a></dd>
          <dd><a href="#">大酒店</a></dd>
          <dd><a href="#">购物流程/团购</a></dd>
          <dd><a href="#">购物流程</a></dd>
          <dd><a href="#">购物流程</a></dd>
          <dd><a href="#">购物流程</a></dd>
        </dl>
        <dl>
          <dt>服务指南</dt>
          <dd><a href="#">购物流程</a></dd>
          <dd><a href="#">大酒店</a></dd>
          <dd><a href="#">购物流程/团购</a></dd>
          <dd><a href="#">购物流程</a></dd>
          <dd><a href="#">购物流程</a></dd>
          <dd><a href="#">购物流程</a></dd>
        </dl>
        <dl>
          <dt>服务指南</dt>
          <dd>
            <img src="/images/erweima.png" alt="">
            品优购客户端
          </dd>
        </dl>
      </div>
      <div class="mod_copyright">
        <div class="links">
          <ul class="clearfix">
            <li><a href="#">关于我们</a></li>
            <li><a href="#">关于我</a></li>
            <li><a href="#">品优购社团</a></li>
            <li><a href="#">营销中心</a></li>
            <li><a href="#">English Site</a></li>
            <li><a href="#">Contact U</a></li>
          </ul>
        </div>
        <div class="copyright">
          地址：xxxxxxxxx 邮箱：xxxxxx 电话：xxxxxx 传真：xxxxxx<br>
          备案号
        </div>
      </div>
    </div>
  </footer>
  <script src="/js/index.js"></script>

  </script>


</body>

</html>